<template>
  <div class="product-register-info-record">
    <div class="product-register-timeline" ref="timeline">
      <base-timeline
        :data="recordPage.list"
        :record-render="renderRecord"
        :loading="recordLoading"
        :loadmore="recordPage.hasNextPage"
        @load="loadmore"
      />
    </div>
  </div>
</template>

<script>
import Page from "@model/Page";
import { translateAction } from '@src/util/record'

import {
  getRegisterLogList
} from '@src/api/productRegisterApi.js';

// import { getMenuRecord } from "@src/api/ProductV2Api.js";
function createAttachmentDom(h, attachments) {
  return attachments && attachments.length > 0 ? (
    <div class="base-timeline-attachment base-file__preview">
      {attachments.map((item) => (
        <base-file-item Source={attachments} file={item} key={item.id} readonly size="small" />
      ))}
    </div>
  ) : (
    ""
  );
}

export default {
  name: "product-register-info-record",
  props: {
    shareData: {
      type: Object,
      default: () => ({}),
    },
    id: {
      
    }
  },
  data() {
    return {
      params: {
        primaryId: this.id,
        pageNum: 1,
        pageSize: 15,
      },
      recordLoading: false, // loading 状态
      recordPage: new Page(), // 页面数据
    };
  },
  computed: {
    // 权限
    // authorities() {
    //   let user = this.loginUser || {};
    //   return user.authorities || {};
    // },
    // /** 是否允许操作 */
    // allowOperate() {
    //   return this.productTemplate.isDelete === 0;
    // },
    // 当前用户id
    // loginUser() {
    //   return this.shareData.loginUser;
    // },
  },
  mounted() {
    this.initRecord();
    // this.$eventBus.$on(
    //   "customer_info_record.update_record_list",
    //   this.searchRecord
    // );
  },
  methods: {
    /**
     * 同时满足以下条件允许删除该记录
     * 1. 该记录没有被删除
     * 2. 产品编辑权限（PRODUCT_EDIT）值为3 或者 是创建人
     * 3. 该客户没有被删除
     */
    allowDeleteRecord(item) {
      // let isDelete = item.content && item.content.isDelete == "true";
      // let authorities = this.authorities;
      // let user = this.loginUser;
      // let isCreator = item.userId == user.userId;

      // return (
      //   !isDelete
      //   && ((authorities["PRODUCT_EDIT"] && authorities["PRODUCT_EDIT"] == 3)
      //     || isCreator)
      //   && this.allowOperate
      // );
      return false
    },
    /** 抓取信息动态 */
    fetchRecord(params) {
      // !params.primaryId && (params.primaryId = this.id)
      return getRegisterLogList(params);
    },
    // 初始化信息动态
    initRecord() {
      this.params.pageNum = 1;
      if (this.id) this.params.id = this.id;
      this.searchRecord();
    },
    // 加载更多
    async loadmore() {
      try {
        this.params.pageNum++;
        this.recordLoading = true;

        let res = await this.fetchRecord(this.params);
        let result = res.data;
        this.recordLoading = false;
        this.recordPage.merge(result);
      } catch (error) {
        console.error(`product template record loadmore err ${error}`);
      }
    },
    /** 根据记录的action渲染对应的内容，支持jsx和render函数 */
    renderRecord(h, item) {
      let {
        action,
        userName,
        content,
        attachments,
        serialNumber
      } = item;

      if(action=="删除"){
        return[
          <h5>
              <strong>{userName}</strong> {translateAction(action)} {content?content.updateFields?content.updateFields:'':''}
          </h5>,
            createAttachmentDom(h, attachments)
          ]
      }

      return [
        <h5>
          <strong>{userName}</strong>{this.$t('common.record.product.register.actionRegisteredMessage', {action: translateAction(action), content: content?.serialNumber ? `#${content.serialNumber}` : '', status: action === '提交' ? this.$t('common.base.approve') : ''})}
        </h5>,
        content ? (
          content.fields ? (
            <p class="secondary-info">{this.$t('common.base.modifyField')}：{content.fields}</p>
          ) : null
        ) : null,
        content ? (
          content.reason ? (
            <p class="secondary-info">{this.$t('common.base.reason')}：{content.reason}</p>
          ) : null
        ) : null,
        createAttachmentDom(h, attachments),
      ];
    },
    // 查询信息动态
    async searchRecord() {
      try {
        this.recordLoading = true;
        let res = await this.fetchRecord(this.params);
        let result = res.data || {};
        this.recordLoading = false;
        this.recordPage.list = [];
        this.recordPage.merge(result);

        this.$emit("changeRecordCount", result.total);
      } catch (error) {
        console.error(`searchRecord ${error}`);
      }
    },
  },
};
</script>

<style lang="scss">
.product-register-info-record {
  height: 100%;

  display: flex;
  flex-flow: column nowrap;

  h5 {
    margin-bottom: 5px;
    .icon-address {
      margin-left: 5px;
    }
  }

  .private {
    @include fontColor();
    .iconfont {
      font-size: 14px;
      margin: 0 6px;
    }
  }

  .secondary-info {
    margin-top: 8px;
  }
}

.product-register-timeline {
  padding-top: 15px;
  padding-right: 15px;

  flex: 1;
  overflow: auto;
}

.product-register-quick-comment {
  position: sticky;
  bottom: 0;
  z-index: 1;

  padding: 0px;

  background-color: #fff;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.095);

  .base-comment {
    border-color: transparent;
  }
}
</style>
